import React from 'react'
import { CropImageUpload, info, success, FileUpload, Select, Input, Dialog, Checkbox, Button,Link, TitleBar, Table } from '../../ui-components'
import style from './style.companySettings'
import { connect } from 'react-redux'
import util from '../../util'
import m from 'moment'
import tz from 'moment-timezone/builds/moment-timezone-with-data.js'

window.tz = tz

export default
@connect(({ app }) => ({ app }))
class ComponySettings extends React.Component {

  state = {
    avatarUrl: ''
  }

	componentDidMount() {
		this.props.fetchOrg()
	}

	state = {}

	update(field) {
		this.props.syncOrg(field)
	}

	handleSubmit() {
		const { fullName, shortName, avatarUrl, timezone } = this.props.app.org
		const _avatarUrl = this.state.avatarUrl || avatarUrl
		this.props.updateOrg({
			fullName,
			shortName,
      avatarUrl: _avatarUrl,
			timezone
		}, () => {
			success('更新成功!')
      this.props.syncOrg({
        avatarUrl: _avatarUrl
      })
		})
	}

	render() {
		const { org } = this.props.app
		return (
			<div>
				<div className={style.list}>
					<div>
						<div>
							<Input 
								onChange={e => this.update({
									fullName: e.target.value 
								})}
                                disabled
								value={org.fullName || ''}
								label="公司全称" 
								attr='公开'/>
							<Input 
								label="公司简称" 
								attr='公开'
								value={org.shortName || ''}
								onChange={e => this.update({
									shortName: e.target.value
								})}
							/>
              {/*
							<Select
								value={org.timeZone || ''}
								onChange={e => this.update({
									timezone: e.target.value
								})}
							>
								<option value="">选择时区..</option>
							</Select>
              */}
              <CropImageUpload
                width="98"
								label="公司logo"
                file={this.state.avatarUrl || org.avatarUrl}
                onUpload={({ x, y, e, file }) => {
                  //info('正在上传图片，请勿进行其他操作', true);
                  this.props.updateAvatar({
                    x, y, e
                  }, ({ presignedPutUrl, publicGetUrl }) => {
                    this.props.fileUpload({
                      url: presignedPutUrl,
                      file: file.file,
                      cb: () => {
                        //success('上传成功')
                        this.setState({
                          avatarUrl: publicGetUrl
                        })
                      }
                    })
                  })
                }}
							/>
               <Button 
                label="更新"
                onClick={::this.handleSubmit}
              />
						</div>
					</div>
				</div>
			</div>
		)
	}
}

